﻿<!DOCTYPE html>
<html style="height: 100%">
   <head>
       <meta charset="utf-8">
   </head>
   <body style="height: 100%; margin: 0">
       <div id="container" style="height:700px;width:1500px;"></div>
	   <canvas  id="container2" style="height:700px;width:1500px;"></canvas> 
       <script type="text/javascript" src="js/echarts.min.js"></script>
       <script type="text/javascript" src="js/world.js"></script>
      <script type="text/javascript" src="js/jquery.js"></script>
	  <script src="js/echarts-gl.js"></script>
	  <script type="text/javascript" src="js/echarts-min-gl.js"></script>
       <script type="text/javascript">
					var dom = document.getElementById("container");
					var myChart = echarts.init(dom);
					var app = {};
					option = null;
					myChart.setOption({
					series:[{
								type: 'map',
								mapType: 'world',
								roam: true,
								label: {
									normal: {
										show: false
									},
									emphasis: {
										show: true
									}
								},
								
								}
							]
						});
					
						var dom2 = document.getElementById("container2");
						var myChart2 = echarts.init(dom2);	
						option2={
							globe: {
									baseTexture: myChart,
									// shading: 'lambert',
									light: { // 光照阴影
										main: {
											color: '#fff', // 光照颜色
											intensity: 1.2, // 光照强度
											// shadowQuality: 'high', //阴影亮度
											shadow: false, // 是否显示阴影
											alpha: 40,
											beta: -30
										},
										ambient: {
											intensity: 0.5
										}
									},
									viewControl: {
										alpha: 30,
										beta: 160,
										// targetCoord: [116.46, 39.92],
										autoRotate: true,
										autoRotateAfterStill: 10,
										distance: 240
									}
								},
								series: [{
									name: 'lines3D',
									type: 'lines3D',
									coordinateSystem: 'globe',
									effect: {
										show: true
									},
									blendMode: 'lighter',
									lineStyle: {
										width: 2
									},
									data: [],
									silent: false
								}]
							};
						myChart2.setOption(option2);
       </script>
   </body>
</html>